<template>
	<FormItem
		v-bind="$attrs"
		v-on="$listeners"
	>
		<template #label>
			<span>{{label}}
				<template v-if="tipLabel">
					<Tooltip placement="top">
						<template #content>
							<div

								v-html="tipLabel"
							/>
						</template>
						<a :class="tipIcon + ' global-tooltip-question'"/>
					</Tooltip>
				</template>
				<a
					v-if="!tipLabel && label"
					class="empty-icon"
				/>
			</span>
		</template>
		<slot/>
	</FormItem>
</template>

<script>
import {FormItem, Tooltip} from 'element-ui';
export default {
	name:'FormTipItem',
	components:{
		FormItem,
		Tooltip
	},
	props:{
		label:{
			type:String,
			default:'',
		},
		tipLabel:{
			type:String,
			default:'',
		},
		tipIcon:{
			type:String,
			default:'el-icon-question',
		},
	},
};
</script>
<style lang="scss" scoped>
.empty-icon {
    display: inline-block;
    width: 14px;
}
</style>